// 初始化坐标
var xPos = 0;
var yPos = 0;
// 频率和时间间隔
var step = 1;
var timer = 10;
// 初始化窗口宽度和高度
var width = 0;
var height = 0;
// 初始化顶部和左边偏移量
var Woffset = 0;
var Hoffset = 0;
// 判断条件初始化
var yon = true;
var xon = true;
var pause = true;
var interval;
// 获取
var imgwrap = document.getElementById("imgwrap");
var close = document.getElementById("close");
// 点击隐藏
close.onclick = function () {
    imgwrap.style.display = "none";
}

function changePosition() {
    // 获取窗口宽度和高度
    width = document.body.clientWidth || document.documentElement.clientWidth;
    height = document.body.clientHeight || document.documentElement.clientHeight;

    // 获取宽度和高度的偏移量
    Woffset = imgwrap.offsetWidth;
    Hoffset = imgwrap.offsetHeight;

    if (yon) {
        yPos += step;
        if (yPos >= (height - Hoffset)) {
            yPos = (height - Hoffset);
            yon = false;
        }
    } else {
        yPos -= step;
        if (yPos < 0) {
            yPos = 0;
            yon = true;
        }
    }

    if (xon) {
        xPos += step;
        if (xPos >= (width - Woffset)) {
            xPos = (width - Woffset);
            xon = false;
        }
    } else {
        xPos -= step;
        if (xPos < 0) {
            xPos = 0;
            xon = true;
        }
    }

    imgwrap.style.top = (yPos + document.body.scrollTop) + "px";
    imgwrap.style.left = (xPos + document.body.scrollLeft) + "px";
}

function start() {
    interval = setInterval(changePosition, timer);
}

function pauseResume() {
    if (pause) {
        clearInterval(interval);
        pause = false;
    } else {
        interval = setInterval(changePosition, timer);
        pause = true;
    }
}

start();
imgwrap.onmouseover = function () {
    pauseResume();
}
imgwrap.onmouseout = function () {
    pauseResume();
}